<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>INSPINIA | Dashboard v.4</title>

    <link href="/static/admin/cmsStyle/css/bootstrap.min.css" rel="stylesheet">
    <link href="/static/admin/cmsStyle/font-awesome/css/font-awesome.css" rel="stylesheet">
    <link href="/static/admin/cmsStyle/css/animate.css" rel="stylesheet">
    <link href="/static/admin/cmsStyle/css/style.css" rel="stylesheet">


    <!-- Toastr style -->
    <link href="/static/admin/cmsStyle/css/plugins/toastr/toastr.min.css" rel="stylesheet">

    <!-- Gritter -->
    <link href="/static/admin/cmsStyle/js/plugins/gritter/jquery.gritter.css" rel="stylesheet">

</head>

<body class="top-navigation">

<div id="wrapper">
    <div id="page-wrapper" class="gray-bg">
        <div class="row border-bottom white-bg">
        </div>
        <div style="padding-top: 10px;">

            <div class="row  border-bottom white-bg dashboard-header">
                    <div class="col-sm-12" id="money" style="height: 40rem"></div>
            </div>
    </div>
</div>
{include file='common/dashBoard_js'}
<script src="/static/echart/echarts.js"></script>
<script src="/static/echart/vintage.js"></script>
<script src="/static/echart/macarons.js"></script>
 {include file='common/footer'}
<script >
$(function () {
        var money = echarts.init(document.getElementById('money'));
        option1 = {
            backgroundColor: "#fff",
            color: ['#24a7f6', '#fc6175'],

            title: [{
                text: '',
                left: '1%',
                top: '3%',
                textStyle: {
                    color: '#111'
                }
            }],
            tooltip: {
                trigger: 'axis'
            },
            legend: {
                x: '45%',
                top: '2%',
                textStyle: {
                    color: '#f00',
                },
                data: ['2017年', '2018年']
            },
            grid: {
                left: '0',
                right: '2%',
                top: '12%',
                bottom: '6%',
                containLabel: true
            },
            toolbox: {
                "show": false,
                feature: {
                    saveAsImage: {}
                }
            },
            xAxis: {
                type: 'category',
                "axisLine": {
                    lineStyle: {
                        color: '#111'
                    }
                },
                "axisTick": {
                    "show": false
                },
                axisLabel: {
                    textStyle: {
                        color: '#111'
                    }
                },
                boundaryGap: false,
                data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月','8月','9月','10月','11月','12月']
            },
            yAxis: {
                "axisLine": {
                    lineStyle: {
                        color: '#111'
                    }
                },
                splitLine: {
                    show: true,
                    lineStyle: {
                        color: '#e5e5e5'
                    }
                },
                "axisTick": {
                    "show": false
                },
                axisLabel: {
                    textStyle: {
                        color: '#111'
                    }
                },
                type: 'value'
            },
            series: [{
                name: '2017年',
                smooth: true,
                type: 'line',
                symbolSize: 8,
                symbol: 'circle',
                data: [90, 50, 39, 50, 120, 82, 80,70, 50, 50, 87, 90]
            }, {
                name: '2018年',
                smooth: true,
                type: 'line',
                symbolSize: 8,
                symbol: 'circle',
                data: [70, 50, 50, 87, 90, 80, 70,90, 50, 39, 50, 120]
            },]
        }

        money.setOption(option1);
    })



</script>



</body>
</html>
